<%@ page language="java" contentType="text/html; charset=UTF-8"
	pageEncoding="UTF-8"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 5.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<!--common-->
<link href="${pageContext.request.contextPath }/admin/css/style.css"
	rel="stylesheet">
<link
	href="${pageContext.request.contextPath }/admin/css/style-responsive.css"
	rel="stylesheet">
<link
	href="${pageContext.request.contextPath }/admin/css/stuInfoManage/main.css"
	rel="stylesheet">
<link
	href="${pageContext.request.contextPath }/admin/css/stuInfoManage/stuInfoManage.css"
	rel="stylesheet">
<link
	href="${pageContext.request.contextPath }/admin/css/stuInfoManage/stuInfoSearch.css"
	rel="stylesheet">

<title>Insert title here</title>
<script
	src="${pageContext.request.contextPath }/admin/js/jquery-1.10.2.min.js"></script>
<script type="text/javascript">
	function showSuccessModal() {
		$('#showSuccessModel').modal('show');
	}

	//触发模态框的同时调用此方法  
	function editInfo(title, id, content) {
		//向模态框中传值  
		$('#niticeTitle').val(title);
		$('#noticeContent').val(content);
		$('#noticeId').val(id);
		$('#updateNotice').modal('show');
	}

	function showNoticeList() {
		var url = "${pageContext.request.contextPath }/admin/showNotices.do";
		$.ajax({
					type : "post",
					url : url,
					dataType : 'json',
					success : function(result) {
						var dataObj = result; //返回的result为json格式的数据
						var datas = "";
						$
								.each(
										dataObj,
										function(index, notice) {
											if (index % 4 == 0)
												datas += "<a href='#' data-toggle='modal' data-target='#updateNotice' class='list-group-item list-group-item-success' onclick=\"editInfo('"
														+ notice.noticeTitle
														+ "','"
														+ notice.noticeId
														+ "','"
														+ notice.noticeContent
														+ "')\">";
											else if (index % 4 == 1)
												datas += "<a href='#' data-toggle='modal' data-target='#updateNotice' class='list-group-item list-group-item-info' onclick=\"editInfo('"
														+ notice.noticeTitle
														+ "','"
														+ notice.noticeId
														+ "','"
														+ notice.noticeContent
														+ "')\">";
											else if (index % 4 == 2)
												datas += "<a href='#' data-toggle='modal' data-target='#updateNotice' class='list-group-item list-group-item-warning' onclick=\"editInfo('"
														+ notice.noticeTitle
														+ "','"
														+ notice.noticeId
														+ "','"
														+ notice.noticeContent
														+ "')\">";
											else
												datas += "<a href='#' data-toggle='modal' data-target='#updateNotice' class='list-group-item list-group-item-danger' onclick=\"editInfo('"
														+ notice.noticeTitle
														+ "','"
														+ notice.noticeId
														+ "','"
														+ notice.noticeContent
														+ "')\">";
											datas += (index + 1) + ".标题："
													+ notice.noticeTitle
													+ ";内容："
													+ notice.noticeContent;
											datas += "<span class='badge'>X</span></a> ";
										});
						$("#noticeList").html(datas);//要刷新的div
					},
					error : function() {
						alert("失败");
					}
				});
	}

	function sendNotice() {
		$.ajax({
			cache : true,
			type : "POST",
			url : "${pageContext.request.contextPath }/admin/sendNotice.do",
			data : $('#sendNoticeForm').serialize(),
			success : function(data) {
				showSuccessModal();
				showNoticeList();
				$('#myModal').modal('hide');
			},
			error : function(request) {
				alert("sendNotice error");
			}
		});
	};

	function updateNotice() {
		$.ajax({
			cache : true,
			type : "POST",
			url : "${pageContext.request.contextPath }/admin/updateNotice.do",
			data : $('#updadeNoticeForm').serialize(),
			success : function(data) {
				showSuccessModal();
				showNoticeList();
				$('#updateNotice').modal('hide');
			},
			error : function(request) {
				alert("sendNotice error");
			}
		});
	};
</script>
<style type="text/css">
</style>
</head>
<body class="sticky-header" onload="showNoticeList()">
	<section> <!-- 导入左边菜单栏 --> <%@include
		file="common/sidebarStart.jsp"%>
	<li class="menu-list "><a href="#"><i class="fa fa-book"></i>
			<span>用户信息管理</span></a>
		<ul class="sub-menu-list">
			<li><a
				href="${pageContext.request.contextPath }/page.do?url=admin/verify">
					用户信息审核</a></li>
			<li><a
				href="${pageContext.request.contextPath }/page.do?url=admin/userInfoSelect">
					用户信息查询</a></li>
		</ul></li>

	<li class="menu-list"><a href=""><i class="fa fa-tasks"></i> <span>反馈信息管理</span></a>
		<ul class="sub-menu-list">
			<li><a
				href="${pageContext.request.contextPath }/page.do?url=admin/selectFeedback">
					查看反馈信息</a></li>
		</ul></li>

	<li class="menu-list nav-active"><a href="#"><i
			class="fa fa-th-list"></i> <span>发布公告</span></a>
		<ul class="sub-menu-list">
			<li class="active"><a
				href="${pageContext.request.contextPath }/page.do?url=admin/sendNotice">
					网站发布公告 </a></li>
		</ul></li>
	<%@include file="common/sidebarEnd.jsp"%> <!-- 主内容开始-->
	<div class="main-content">
		<!-- 通知菜单栏 -->
		<%@include file="common/notifyMenu.jsp"%>

		<div class="container">
			<div class="row">
				<div class="col-md-2"></div>
				<div class="col-md-8 little-title">管理公告</div>
				<div class="col-md-2 little-button">
					<!-- 按钮触发模态框 -->
					<button class="btn btn-primary " data-toggle="modal"
						data-target="#myModal">添加公告</button>
				</div>
			</div>
			<div class="row">
				<div class="col-md-1"></div>
				<div class="col-md-10">
					<div class="panel panel-info">
						<div class="panel-heading">公告内容</div>
						<div class="panel-body">
							<p>这是一个基本的面板内容。这是一个基本的面板内容。 这是一个基本的面板内容。这是一个基本的面板内容。
								这是一个基本的面板内容。这是一个基本的面板内容。 这是一个基本的面板内容。这是一个基本的面板内容。</p>
						</div>
						<div class="list-group" id="noticeList"></div>
					</div>

				</div>
				<div class="col-md-1"></div>
			</div>
			<div class="row">
				<div class="col-md-4"></div>
				<div class="col-md-4 >
					<nav aria-label="Page navigation">
						<ul class="pagination ">
							<li><a href="#" aria-label="Previous"> <span
									aria-hidden="true">&laquo;</span>
							</a></li>
							<li><a href="#">1</a></li>
							<li><a href="#">2</a></li>
							<li><a href="#">3</a></li>
							<li><a href="#">4</a></li>
							<li><a href="#">5</a></li>
							<li><a href="#" aria-label="Next"> <span aria-hidden="true">&raquo;</span>
							</a></li>
						</ul>
					</nav>
				</div>
				<div class="col-md4"></div>
			</div>
			
		</div>
	</div>
	</div>
	<!-- 主内容结束--> </section>

	<!--  模态框（Modal） -->
	<div class="modal fade" id="myModal" tabindex="-1" role="dialog"
		aria-labelledby="myModalLabel" aria-hidden="true">
		<div class="modal-dialog">
			<div class="modal-content">
				<div class="modal-header">
					<button type="button" class="close" data-dismiss="modal"
						aria-hidden="true">&times;</button>
					<h4 class="modal-title" id="myModalLabel">公告</h4>
				</div>
				<div class="modal-body">
					<form class="bs-example bs-example-form" role="form"
						id="sendNoticeForm">
						<div class="input-group">
							<span class="input-group-addon">标题</span> <input type="text"
								name="noticeTitle" class="form-control" placeholder="标题">
						</div>
						<br>
						<div class="form-group">
							<label for="name">公告内容</label>
							<textarea class="form-control" rows="3" name="noticeContent"></textarea>
						</div>
					</form>
				</div>
				<div class="modal-footer">
					<button type="button" class="btn btn-default" data-dismiss="modal">取消</button>
					<button type="button" class="btn btn-primary"
						onclick="sendNotice()">提交</button>
				</div>
			</div>
			<!-- .modal-content -->
		</div>
	</div>
	<!-- /.modal -->

	<!-- 更新模态框（Modal） -->
	<div class="modal fade" id="updateNotice" tabindex="-1" role="dialog"
		aria-labelledby="myModalLabel" aria-hidden="true">
		<div class="modal-dialog">
			<div class="modal-content">
				<div class="modal-header">
					<button type="button" class="close" data-dismiss="modal"
						aria-hidden="true">&times;</button>
					<h4 class="modal-title" id="myModalLabel">更新公告</h4>
				</div>
				<div class="modal-body">
					<form class="bs-example bs-example-form" role="form"
						id="updadeNoticeForm">
						<input type="hidden" name="noticeId" id="noticeId">
						<div class="input-group">
							<span class="input-group-addon">标题</span> <input type="text"
								id="niticeTitle" name="noticeTitle" class="form-control"
								placeholder="标题">
						</div>
						<br>
						<div class="form-group">
							<label for="name">公告内容</label>
							<textarea class="form-control" rows="3" name="noticeContent"
								id="noticeContent"></textarea>
						</div>
					</form>
				</div>
				<div class="modal-footer">
					<button type="button" class="btn btn-default" data-dismiss="modal">取消</button>
					<button type="button" class="btn btn-primary"
						onclick="updateNotice()">提交</button>
				</div>
			</div>
			<!-- /.modal-content -->
		</div>
	</div>
	<%@include file="common/showSuccessModel.jsp"%>
	<!-- Placed js at the end of the document so the pages load faster -->

	<script type="text/javascript"
		src="${pageContext.request.contextPath }/admin/js/auto.js"></script>
	<script
		src="${pageContext.request.contextPath }/admin/js/jquery-ui-1.9.2.custom.min.js"></script>
	<script
		src="${pageContext.request.contextPath }/admin/js/jquery-migrate-1.2.1.min.js"></script>
	<script
		src="${pageContext.request.contextPath }/admin/js/bootstrap.min.js"></script>
	<script
		src="${pageContext.request.contextPath }/admin/js/modernizr.min.js"></script>
	<script
		src="${pageContext.request.contextPath }/admin/js/jquery.nicescroll.js"></script>

	<!--页面公共脚步-->
	<script src="${pageContext.request.contextPath }/admin/js/scripts.js"></script>
</body>
</html>